import React,{Component} from 'react'
import './banner1.css'
import Swiper from 'swiper'
import HomeCommon from 'pages/home/HomeCommon'


const Item = ( props ) => {
    return(
        <div className="swiper-slide">
            <img src={ props[800] }/>
        </div> 
    )
}

class Banner1 extends Component{

   


    componentDidUpdate () {
       
        this.Swiper1 = new Swiper (this.mySwiper, {
            loop: true, // 循环模式选项
            
          }) 
    }


    renderItem = () => {
        return this.props.index_detail && this.props.index_detail.image_url_set.single_many.map( item => {
          return  <Item key={item[800]} {...item}/>
        } )
    }

    render () {

        return (
            <div className="index">
            <div className="swiper-container" ref={ el => this.mySwiper = el}>
                <div className="swiper-wrapper">
                    { this.renderItem()}
                   
                </div>
                <div className="swiper-pagination"></div>
                
                
            </div>
            </div>
        )
    }
}

export default HomeCommon(Banner1)